<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>用户管理</title>
	<meta name="decorator" content="default"/>
    <%@include file="/WEB-INF/views/include/treetable.jsp" %>
	<script type="text/javascript">
		$(document).ready(function() {
			$("#btnExport").click(function(){
				top.$.jBox.confirm("确认要导出用户数据吗？","系统提示",function(v,h,f){
					if(v=="ok"){
						$("#searchForm").attr("action","${ctx}/sys/user/export");
						$("#searchForm").submit();
					}
				},{buttonsFocus:1});
				top.$('.jbox-body .jbox-icon').css('top','55px');
			});
			$("#btnImport").click(function(){
				$.jBox($("#importBox").html(), {title:"导入数据", buttons:{"关闭":true}, 
					bottomText:"导入文件不能超过5M，仅允许导入“xls”或“xlsx”格式文件！"});
			});

            var tpl = $("#treeTableTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
            var data = ${fns:toJson(list)}, ids = [], rootIds = [];

            for (var i=0; i<data.length; i++){
                ids.push(data[i].id);
            }
            ids = ',' + ids.join(',') + ',';
            for (var i=0; i<data.length; i++){
                if (ids.indexOf(','+data[i].parentId+',') == -1){
                    if ((','+rootIds.join(',')+',').indexOf(','+data[i].parentId+',') == -1){
                        rootIds.push(data[i].parentId);
                    }
                }
            }
            for (var i=0; i<rootIds.length; i++){
                addRow("#treeTableList", tpl, data, rootIds[i], true);
            }
            $("#treeTable").treeTable({expandLevel : 5});
		});
        function addRow(list, tpl, data, pid, root){
            for (var i=0; i<data.length; i++){
                var row = data[i];
                if ((${fns:jsGetVal('row.parentId')}) == pid){
                    $(list).append(Mustache.render(tpl, {dict: {blank123:0}, pid: (root?0:pid), row: row}));
                    addRow(list, tpl, data, row.id);
                }
            }
        }
		function page(n,s){
			if(n) $("#pageNo").val(n);
			if(s) $("#pageSize").val(s);
			$("#searchForm").attr("action","${ctx}/sys/user/list");
			$("#searchForm").submit();
	    	return false;
	    }
	</script>
</head>
<body>
	<div id="importBox" class="hide">
		<form id="importForm" action="${ctx}/sys/user/import" method="post" enctype="multipart/form-data"
			class="form-search" style="padding-left:20px;text-align:center;" onsubmit="loading('正在导入，请稍等...');"><br/>
			<input id="uploadFile" name="file" type="file" style="width:330px"/><br/><br/>　　
			<input id="btnImportSubmit" class="btn btn-primary" type="submit" value="   导    入   "/>
			<a href="${ctx}/sys/user/import/template">下载模板</a>
		</form>
	</div>
	<ul class="nav nav-tabs">
		<li class="active"><a href="${ctx}/sys/user/list">用户列表</a></li>
		<shiro:hasPermission name="sys:user:edit"><li><a href="${ctx}/sys/user/form">用户添加</a></li></shiro:hasPermission>
	</ul>
	<form:form id="searchForm" modelAttribute="user" action="${ctx}/sys/user/list" method="post" class="breadcrumb form-search ">
		<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
		<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
		<sys:tableSort id="orderBy" name="orderBy" value="${page.orderBy}" callback="page();"/>
		<ul class="ul-form">
			<li><label>用户权限：</label>
                <form:select path="role" class="input-medium">
                    <form:option value="" label="请选择"/>
                    <form:options items="${allRoles}" itemLabel="name" itemValue="id" htmlEscape="false"/>
                </form:select>
			</li>
			<li>
                <label>归属公司：</label>
                <sys:treeselect id="company" name="company.id" value="${user.company.id}" labelName="company.name" labelValue="${user.company.name}"
				title="公司" url="/sys/office/treeData?type=1" cssClass="input-small" allowClear="true"/>
            </li>
            <li>
                <label>归属分组：</label>
                <sys:treeselect id="office" name="office.id" value="${user.office.id}" labelName="office.name" labelValue="${user.office.name}"
                                title="部门" url="/sys/office/treeData?type=2" cssClass="input-small" allowClear="true" notAllowSelectParent="true"/>
            </li>
			<li>
                <label style="width: 0;"></label>
                <form:input path="loginName" htmlEscape="false" maxlength="50" class="input-medium" placeholder="帐号,名字,手机号"/>
            </li>
			<li class="btns"><input id="btnSubmit" class="btn btn-primary" type="submit" value="查询" onclick="return page();"/>
			<li class="clearfix"></li>
		</ul>
	</form:form>
	<sys:message content="${message}"/>

    <table id="treeTable" class="table table-striped table-bordered table-condensed">
        <thead>
        <tr>
            <th>组织</th>
            <th>姓名</th>
            <th>手机</th>
            <th>角色</th>
            <th>状态</th>
            <shiro:hasPermission name="equipment:eleGroup:edit"><th>操作</th></shiro:hasPermission>
        </tr>
        </thead>
        <tbody id="treeTableList"></tbody>
    </table>
    <script type="text/template" id="treeTableTpl">
        <tr id="{{row.id}}" pId="{{pid}}">
            <td>
                {{row.photo}}
            </td>
            <td>
                <a href="${ctx}/sys/user/info?id={{row.id}}">
                    {{row.name}}
                </a>
            </td>
            <td>
                {{row.mobile}}
            </td>
            <td>
                {{row.role.name}}
            </td>
            <td>
                {{row.remarks}}
            </td>
            <shiro:hasPermission name="sys:user:edit">
                <td>
                    <div style="{{row.loginFlag}}">
                        <a href="${ctx}/sys/user/form?id={{row.id}}">修改</a>
                        <a href="${ctx}/sys/user/delete?id={{row.id}}" onclick="return confirmx('确认要删除该用户吗？', this.href)">删除</a>
                    </div>
                </td>
            </shiro:hasPermission>
        </tr>
    </script>
</body>
</html>